{extend name="common/index1" /}
{block name="style"}
<link rel="stylesheet" href="__TEMPLATE__/mobile/index/css/index.css" type="text/css">
<link rel="stylesheet" href="__TEMPLATE__/mobile/index/css/member.css" type="text/css">
<script type="text/javascript" src="__TEMPLATE__/sysme/js/aa.js"></script>
<link rel="stylesheet" type="text/css" href="__SYSMET__/lib/Hui-iconfont/1.0.8/iconfont.css" />

<script src="__TEMPLATE__/sysme/tili/js/jquery.1.7.2.min.js"></script>
<script src="__TEMPLATE__/sysme/tili/js/mobiscroll_002.js" type="text/javascript"></script>
<script src="__TEMPLATE__/sysme/tili/js/mobiscroll_004.js" type="text/javascript"></script>
<link href="__TEMPLATE__/sysme/tili/css/mobiscroll_002.css" rel="stylesheet" type="text/css">
<link href="__TEMPLATE__/sysme/tili/css/mobiscroll.css" rel="stylesheet" type="text/css">
<script src="__TEMPLATE__/sysme/tili/js/mobiscroll.js" type="text/javascript"></script>
<script src="__TEMPLATE__/sysme/tili/js/mobiscroll_003.js" type="text/javascript"></script>
<script src="__TEMPLATE__/sysme/tili/js/mobiscroll_005.js" type="text/javascript"></script>
<link href="__TEMPLATE__/sysme/tili/css/mobiscroll_003.css" rel="stylesheet" type="text/css"> {/block} {block name="body"}

<style type="text/css">
	.wxts p {
		color: #999;
		font-size: 12px;
		line-height: 20px;
	}
	
	.czjekj {
		display: inline-block;
		width: 50px;
		height: 20px;
		text-align: center;
		font-size: 12px;
		border: 1px solid #ccc;
		color: #666;
		border-radius: 6px;
		line-height: 20px;
		margin-right: 5px;
	}
</style>

<!--线下微信充值-->
<div id="tishi" style="width:210px;height:40px;opacity: .6;background:#000;position:fixed;left:50%;margin-left:-100px;top:100px;display:none;top:30%;"></div>
<div id="tishi_nr" style="width:210px;height:auto;color:#fff;font-size:14px;text-align:center;position:fixed;left:50%;top:30%;margin-left:-100px;z-index: 1;display:none;padding:10px;"></div>
<div style="display:block; width:98%; margin:auto;  margin-top:64px" id="ChongZhi_WeiXin">

	<div style="margin:0 auto;height:auto;">

		<div style="margin:0 auto;overflow: hidden;text-align: center;">
			<img style="width:18px;margin-right:3px;" src="__TEMPLATE__/mobile/index/img/wx.png " />

			<span id="wx_name" style="font-size:13px;color:#5d5555;">微信账号：<i style="normal" id="wx_name">{$weixin.xx_name}</i></span>
		</div>
		<img id="wx_img" src="__ATTACHMENT__/{$weixin.xx_erweima}" style="display:block;width:150px;height:150px;margin:10px auto;">

		<strong style="color:#FF0000;display:block;font-size:12px;margin:10px auto 0;text-align: center;">请在转账成功后再输入转账金额进行提交&nbsp;&nbsp;</strong>
	</div>
	<div style="margin:10px auto 0;width:305px;">
		<h2 style="font-size:12px;display:block;float:left;height:30px;line-height:30px;color:#4e4a4a;margin-top: -4px;">选择账户：</h2>
		<div style="overflow: hidden;margin-left:15px;margin-bottom:10px;">
			{foreach($xxlist.wechat as $vx)}
			<div id="{$vx.id}" class="wx_zh" style="float:left;overflow: hidden;width:auto;margin-right:10px;height:40px;border:1px dashed #807d7d;padding:5px;">
				<img style="width:30px;float:left;margin-right:5px;margin-top:3px;" src="__TEMPLATE__/mobile/index/img/wx.png" />
				<p style="float:left;height:100%;line-height:30px;font-size:14px;color:#807d7d;">{$vx.xx_test}</p>
			</div>
			{/foreach}
		</div>
	</div>
	<form action="" method="post" enctype="application/x-www-form-urlencoded" style="margin-top:20px;width:98%;height:170px;">
		<div style="width:305px;margin:10px auto;height:30px;">
			<div style="width: 100%;height: 100%;" class="czje_q">
				<p style="font-size:12px;display:block;float:left;height:30px;line-height:30px;color:#4e4a4a;margin-top: -4px;">充值金额：</p> <span class="czjekj" id="czje_w">50元</span> <span class="czjekj" id="czje_y">100元</span> <span class="czjekj" id="czje_e">200元</span> <span class="czjekj" id="czje_ws">500元</span> </div>
			<input type="number" name="je" class="je" onchange="if(this.value<=0) this.value=0;" required="required" value="" style="display:block;width:235px;float:left;height:30px;margin-left:60px;text-indent:8px;line-height:30px;color:#292929;border:1px solid #ccc;font-size: 12px;">
			<input type="hidden" name="account" id="xs_wx_pay">
			<input type="hidden" value="1" name="zffs">
			<input type="hidden" value="{$ts.id}" name="usclass">
			<input type="hidden" value="{$ts.czzsbl}" name="hy_zsbs">
			<input type="hidden" value="{$xtcz.xscz_je}" name="xsczje">
			<input type="hidden" value="{$xtcz.xscz_zs}" name="xsczzsbs">
			<input type="hidden" value="{$xtcz.xxcz_je}" name="xxczje">
			<input type="hidden" value="{$xtcz.xxcz_zs}" name="xxczzsbs">

		</div>
		<div style="width:300px;margin:30px auto;height:30px;">
			<p style="width: 100%;height: 100%;"><span style="font-size:12px;display:block;float:left;height:30px;line-height:30px;color:#4e4a4a;">存入时间：</span></p><input readonly="readonly" name="appDateTime" id="appDateTime" type="text" style="display:block;margin-left:60px;text-indent:8px;width:235px;float:left;height:30px;line-height:30px;color:#292929;border:1px solid #ccc;font-size: 12px;" value="{$time|date='Y-m-d H:i:m',###}">
		</div>
		<div style="width:300px;margin:30px auto;height:30px;">
			<p style="width: 100%;height: 100%;"><span style="font-size:12px;display:block;float:left;height:30px;line-height:30px;color:#4e4a4a;">验证信息：</span></p><input type="text" required="required" style="text-indent:8px;margin-left:60px;display:block;width:235px;float:left;height:30px;line-height:30px;color:#292929;border:1px solid #ccc;font-size: 12px;" name="liuyan" placeholder="请输入您的微信账号">
		</div>
		<input type="submit" value="确定提交" style="display:block;width:300px;height:40px;line-height:40px;color:#fff;border-radius: 10px;background:red;margin:50px auto 0;">
	</form>
	<div class="wxts" style="width:98%; line-height:35px;margin-left:1%; margin-top:25%; padding:10px; margin-bottom:60px">
		<p style="font-size: 14px;color: black;">温馨提示：</p>
		<p>1.请手动截屏保存二维码图片或常按保存二维码</p>
		<p>2.请在微信中打开“扫一扫”</p>
		<p>3.在扫一扫中点击右上角，选择“从相册选取二维码”选取截屏的图片</p>
		<p>4.输入您要充值的金额</p>
		<p>5.支付完成以后请填写验证信息(您的微信账号)</p>
		<p>6.如充值未及时到账请联系在线客服</p>
	</div>

</div>
<!--线下微信充值结束-->

<!--线下支付宝充值-->

<script type="text/javascript">
	var currYear = (new Date()).getFullYear();
	var opt = {};
	opt.date = {
		preset: 'date'
	};
	opt.datetime = {
		preset: 'datetime'
	};
	opt.time = {
		preset: 'time'
	};
	opt.default = {
		theme: 'android-ics light', //皮肤样式
		display: 'modal', //显示方式 
		mode: 'scroller', //日期选择模式
		dateFormat: 'yyyy-mm-dd',
		lang: 'zh',
		showNow: true,
		nowText: "今天",
		startYear: currYear - 10, //开始年份
		endYear: currYear + 10 //结束年份
	};

	//		  	$("#appDate").mobiscroll($.extend(opt['date'], opt['default']));
	var optDateTime = $.extend(opt['datetime'], opt['default']);
	//		  	var optTime = $.extend(opt['time'], opt['default']);
	$("#appDateTime").mobiscroll(optDateTime).datetime(optDateTime);
	//		    $("#appTime").mobiscroll(optTime).time(optTime);
</script>

<script type="text/javascript">
	var currYear = (new Date()).getFullYear();
	var opt = {};
	opt.date = {
		preset: 'date'
	};
	opt.datetime = {
		preset: 'datetime'
	};
	opt.time = {
		preset: 'time'
	};
	opt.default = {
		theme: 'android-ics light', //皮肤样式
		display: 'modal', //显示方式 
		mode: 'scroller', //日期选择模式
		dateFormat: 'yyyy-mm-dd',
		lang: 'zh',
		showNow: true,
		nowText: "今天",
		startYear: currYear - 10, //开始年份
		endYear: currYear + 10 //结束年份
	};

	//		  	$("#appDate").mobiscroll($.extend(opt['date'], opt['default']));
	var optDateTime = $.extend(opt['datetime'], opt['default']);
	//		  	var optTime = $.extend(opt['time'], opt['default']);
	$("#appDateTime_z").mobiscroll(optDateTime).datetime(optDateTime);
	//		    $("#appTime").mobiscroll(optTime).time(optTime);
</script>

<script type="text/javascript">
	var currYear = (new Date()).getFullYear();
	var opt = {};
	opt.date = {
		preset: 'date'
	};
	opt.datetime = {
		preset: 'datetime'
	};
	opt.time = {
		preset: 'time'
	};
	opt.default = {
		theme: 'android-ics light', //皮肤样式
		display: 'modal', //显示方式 
		mode: 'scroller', //日期选择模式
		dateFormat: 'yyyy-mm-dd',
		lang: 'zh',
		showNow: true,
		nowText: "今天",
		startYear: currYear - 10, //开始年份
		endYear: currYear + 10 //结束年份
	};

	//		  	$("#appDate").mobiscroll($.extend(opt['date'], opt['default']));
	var optDateTime = $.extend(opt['datetime'], opt['default']);
	//		  	var optTime = $.extend(opt['time'], opt['default']);
	$("#appDateTime_y").mobiscroll(optDateTime).datetime(optDateTime);
	//		    $("#appTime").mobiscroll(optTime).time(optTime);
</script>
<script type="text/javascript">
	$('.czje_q').children('span').click(function() {
		var str = $(this).html();
		var s = str.substring(0, str.length - 1)
		$('.je').val(s);
	})

	$('.czje_q').children('p').children('span').click(function() {
		var str = $(this).html();
		var s = str.substring(0, str.length - 1)
		$('.je').val(s);
	})
   document.getElementsByClassName('wx_zh')[0].style.border='1px solid red'
    $('#xs_wx_pay').val(document.getElementsByClassName('wx_zh')[0].id)
	$('.wx_zh').click(function() {

		$('.wx_zh').css('border', '1px dashed #807d7d')
		$(this).css('border', '1px solid red')
		var id = $(this).attr('id')
		$('#xs_wx_pay').val(id)
		$.ajax({
			type: "post",
			url: "{:url('index/User/getOfflineInfoOne')}",
			data: {
				"id": "Offline_" + id
			},
			success: function(data) {
				//console.log(data)
				var data = data
				if(data.status == '200') {
					$('#wx_img').attr('src', '__ATTACHMENT__/' + data.data.xx_erweima)
					$('#wx_name').html(data.data.xx_name)
				} else {
					$('#tishi').css('display', 'block')
					$('#tishi_nr').css('display', 'block')
					$('#tishi_nr').html(data.info)
					setTimeout(function() {
						$('#tishi').css('display', 'none')
						$('#tishi_nr').css('display', 'none')
					}, 2000)
				}
			}
		});
	})
</script>
{/block}